/* eslint-disable max-lines */
import TauSimpleSelect from '@/components/TauSimpleSelect';
import * as BASE from '@/stores/definitions-base';
import { Input, Switch } from '@alifd/next';
import { t } from '@lingui/macro';
import React from 'react';

const {
  DATETIME_TEXT,
  DATETIMES_TEXT,
  DATE_TEXT,
  TIME_TEXT,
  EMPTY_TEXT,
  ENUMS: ENUMSBase,
  FieldsGrid: FieldGridBase,
  TitleGrid,
  column: columnBase,
  toSelectDataSource,
} = BASE;
export { DATETIME_TEXT, DATETIMES_TEXT, DATE_TEXT, EMPTY_TEXT, TIME_TEXT, TitleGrid, toSelectDataSource };

/**
 * @param {*} path        属性path
 * @param {*} props       column属性
 * @returns column定义
 */
export function column(...args) {
  return columnBase(model, ...args);
}

/**
 * 显示一组表单字段
 * ```js
 * {
 *   fields: string[],    // 字段名称，可以使用.来指定嵌套对象属性，例如order.busOrder.shift
 *   columns: number,     // 列数，默认为4,最大为12,最小为1
 *   model: object,       // 字段定义数据模型的根对象，默认不指定，仅在使用子对象作为根模型时设置
 *   overrideModel: object, // 重载字段定义数据模型
 *   mode: string,        // 表单模式，默认为edit，可选view
 *   itemLayout: object,  // FormItem布局配置，默认为{}
 * }
 * ```
 *
 * @param {object} param0
 * @returns
 */
export function FieldsGrid(props) {
  return <FieldGridBase model={model} {...props} />;
}

//----------------------------------------------------------------------
export const ENUMS = {
  ...ENUMSBase,

  // <br/> 0-未激活<br/> 1-启用<br/> 2-停用
  status: {
    '-1': t`待审核`,
    0: t`未激活`,
    1: t`启用`,
    2: t`停用`,
    9: t`全部`,
  },
  _status_boole: {
    1: true,
    2: false,
  },
  takeOrderStatus: {
    false: t`不可接单`,
    true: t`可接单`,
  },
  type: {
    0: t`调度员`,
    1: t`司机`,
  },

  _WARN_TEXT: {
    0: t`该成员有未完成订单，是否继续删除？`,
    1: t`该成员有未完成任务，是否继续删除？`,
    2: t`该成员有未完成订单和任务，是否继续删除？`,
  },
};

/**
 * 模型定义：
 * 1. 普通文本仅需要定义label
 * 2. 需要通过枚举转换的值，定义text; 当使用renderer返回组件时，text属性无效，需要通过组件的renderPreview来指定预览时的绘制方式
 * 3. 通用的ui属性需要定制时，定义ui; 特定模式(view, edit, add)下的ui，添加后缀定义为ui_<mode>，例如：ui_view, ui_edit, ui_add, ui_table
 * 4. ui可配置属性包括:
 *    renderer: 内容渲染函数, Form表单中的原型为：(value: any, formData: any, fieldDefinition: any) => ReactNode; Table Column中的原型为: (value: any, columnIndex: number, rowData: any) => ReactNode;
 *    itemProps: 表单Form.Item的属性，可以是对象，或函数({ isPreview: boolean, mode: string, value: any, formData: any, ...otherDefinitions}) => void;
 *    span: Grid Cell占用的列数, 默认为1
 *
 * 【注】获取接口的model定义后，vscode中通过正则替换：^(\s+)"label": "([^']+)"  ===> $1label: t`$2`
 */
export const model = {
  id: {
    label: '成员编号',
    ui: {
      itemProps: { required: true, format: 'number', validator: rootStore.memberStore.customValidator },
    },
  },
  memberId: {
    label: '群编号',
    ui: {
      itemProps: { required: true },
    },
  },
  groupId: {
    label: t`群组`,
    ui: {
      itemProps: { required: true },
    },
  },
  groupName: {
    label: t`群名称`,
  },
  type: {
    label: t`类型`,
    text: (v, r) => {
      const count = r.vehicleCount;
      let text = ENUMS.type[v];
      if (v == 0) {
        text = text + `(${count})`;
      }
      return <>{text}</>;
    },
    ui: {
      renderer: (v) => <TauSimpleSelect value={v} dataSource={toSelectDataSource(ENUMS.type)} />,
      itemProps: { required: true },
    },
  },
  points: {
    label: t`积分`,
  },
  username: {
    label: t`用户username`,
  },
  fullname: {
    label: t`名称`,
    ui: {
      itemProps: { required: true },
    },
  },
  nickname: {
    label: t`群昵称`,
    ui: {
      itemProps: { required: true },
    },
  },
  phone: {
    label: t`大陆手机号`,
    ui: {
      itemProps: { required: true, format: 'tel' },
    },
  },
  hkPhone: {
    label: t`香港手机号`,
    ui: {
      itemProps: { format: 'tel' },
    },
  },
  wxAccount: {
    label: t`微信号`,
    ui: {
      itemProps: { required: true },
    },
  },
  status: {
    label: t`状态`,
    text: (v, r) => {
      const renderSwitch = (newStatus) => (
        <Switch
          checked={ENUMS._status_boole[v]}
          autoWidth
          unCheckedChildren={t`停用`}
          checkedChildren={t`启用`}
          size="small"
          onChange={() => rootStore.memberStore.update({ ...r, status: newStatus })}
        />
      );
      const _mapping = {
        0: <>{ENUMS.status[v]}</>,
        1: renderSwitch(2),
        2: renderSwitch(1),
      };
      return _mapping[v];
    },
  },
  takeOrderStatus: {
    label: t`接单状态`,
    text: (v, r) => (<Switch
      checked={v}
      autoWidth
      unCheckedChildren={t`已停止`}
      checkedChildren={t`接单中`}
      size="small"
      onChange={() => rootStore.memberStore.updateTakeStatus({ username: r?.username, takeOrderStatus: !v })}
    />),
  },
  license: {
    label: t`车牌`,
  },
  crBy: {
    label: t`创建者`,
  },
  upBy: {
    label: t`最后修改者`,
  },
  crDate: {
    label: t`创建时间`,
    text: DATETIME_TEXT,
  },
  upDate: {
    label: t`最后修收时间`,
  },
  tenantId: {
    label: t`租户ID`,
  },
  issueOrderCount: {
    label: t`出单数量`,
  },
  takeOrderCount: {
    label: t`接单数量`,
  },
  recordRemarks: {
    label: t`备案提示`,
    ui: {
      renderer: (v) => <Input.TextArea value={v} />,
      span: 4,
    },
  },
  vehicleInfos: {
    label: t`车辆信息`,
    carId: {
      label: t`车辆Id`,
    },
    mainlandLicense: {
      label: t`大陆车牌`,
    },
    hkLicense: {
      label: t`香港车牌`,
    },
    ports: {
      label: t`口岸`,
      text: (v) => <>{v?.join(',') || null}</>,
    },
    vehicleModel: {
      label: t`车型`,
    },
    passengerCapacity: {
      label: t`载客人数`,
    },
    driverIds: {
      label: t`驾驶司机`,
    },
    driverInfos: {
      label: t`司机信息`,
      name: {
        label: t`司机名称`,
      },
      mainPhone: {
        label: t`大陆手机号`,
      },
      hkPhone: {
        label: t`香港手机号`,
      },
      wxAccount: {
        label: t`司机微信号`,
      },
    },
    attachments: {
      label: t`车辆图片`,
      title: {
        label: t`图片标题`,
      },
      description: {
        label: t`图片说明`,
      },
      binaryId: [{
        label: t`图片id`,
      }],
    },
  },
  // 前端新增
  hkLicense: {
    label: t`香港车牌号`,
    text: (v, r) => {
      const { vehicleInfos = [] } = r;
      return <>{vehicleInfos.map((p) => p.hkLicense).join(',')}</>;
    },
  },
  mainlandLicense: {
    label: t`大陆车牌号`,
    text: (v, r) => {
      const { vehicleInfos = [] } = r;
      return <>{vehicleInfos.map((p) => p.mainlandLicense).join(',')}</>;
    },
  },
  ports: {
    label: t`口岸`,
    text: (v, r) => {
      const { vehicleInfos = [] } = r;
      return <>{vehicleInfos.map((p) => p.ports)}</>;
    },
  },
  consoleRemarks: {
    label: t`控制台备注`,
    ui: {
      renderer: (v) => <Input.TextArea value={v} />,
      span: 4,
    },
  },
  companyName: {
    label: t`所属公司`,
    ui: {
      renderer: (v) => <Input value={v} readOnly />,
    },
  },
  saveVehicle: {
    label: t`是否保留车辆信息`,
    ui: {
      renderer: (v) => (
        <Switch
          checked={v}
          autoWidth
          unCheckedChildren={t`否`}
          checkedChildren={t`是`}
          size="small"
        />),
    },
  },
  nameGroup: {
    label: t`群编号 / 昵称`,
    text: (v, r) => <>{r.memberId} / {r.nickname}</>,
  },
};
